<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=4.0,minimum-scale=0.1,user-scalable=1"/>
    <title>标题 chatGpt</title>
    <link rel="stylesheet" href="https://www.layuicdn.com/layui/css/layui.css" />

    <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-3.5.1.min.js"></script>
    <script src="https://cdn.staticfile.net/vue/2.2.2/vue.min.js"></script>
    <script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
    <script src="https://cdn.staticfile.net/moment.js/2.29.1/moment.min.js"></script>
    <script src="https://www.layuicdn.com/layui/layui.js"></script>
    <script src="https://cdn.bootcss.com/fetch/2.0.3/fetch.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>



    <script>
        //百度统计代码
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?b2aafc7c030584826f7aa9402ce1880f";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>

    <style>

        body{background: #fff;}
        *{box-sizing: border-box;}
        .cen {text-align: center;}

        .layui-colla-content,
        .layui-colla-content *{font-size: 14px;}
        .layui-colla-content img{max-width:100%}
        .layui-colla-content div{line-height: 30px; font-size: 14px;}
        .layui-nav-item img{width: 30px; height: 30px; border-rAdius: 50%; margin-right: 10px; }
        .layui-nav-item:nth-child(1) a{padding-left:0px;}
        .layui-table, .layui-table-view {margin: 0;}

        .setBox {position: fixed; width: 80%; min-height: 60%; background: #fff; left: 10%; top:10%; border-radius: 10px; overflow: hidden; box-shadow:#999 6px 6px 51px;
            z-index: 9; padding:15px; box-sizing: border-box;}


        .inputAndreview::-webkit-scrollbar {
            display: none;
        }


        .shu-nav > .layui-row {
          border-radius: 16px;
          background: #F7F9FB;
          margin: 20px 0;

        }

        .shu-nav > .layui-row  .layui-nav-item{
          display: flex;
          align-items: center;
          gap: 16px;
          align-self: stretch;
          padding: 0 10px;
          border-bottom: 1px solid var(--Grays-Gray-5, #E5E5EA);
        }

        .shu-nav .layui-nav-tree {
          width: 100%;
        }


        body {
          font-family: Inter;
        }

    </style>



</head>
<body>

<div id="app">


    <!--导航栏-->
    <div>

        <ul class="layui-nav" style="background-color: white;color: #000000;" >
            <li class="layui-nav-item">
              <div style="display: flex;padding: 0px 24px;align-items: center;gap:13px;">

                  <div style="display: inline-block;width: 20px;height: 20px;border-radius: 4px;background: linear-gradient(153deg, rgba(128, 84, 255, 0.50) 16.67%, rgba(1, 131, 251, 0.50) 100%);" >
                  </div>
                  <span style="color: #95A4FC;font-family: Inter;font-style: normal;font-weight: 700;line-height: normal;">ReqGuard
                  </span>
              </div>
            </li>
            <li class="layui-nav-item" style="color: #8E8E93;">
              <div style="display: flex;padding: 0px 24px;align-items: center;gap:13px;">
                  <i class="layui-icon layui-icon-component">
                  </i>
                  <span >需求对话
                  </span>
            </div>
            </li>

            <ul class="layui-nav" style="right:0px; float: right;background: #ffffff">
                <!-- <li class="layui-nav-item" style="right:0" @click="showBox=!showBox"><i class="layui-icon layui-icon-slider" ></i> 设置</li> -->
                <li class="layui-nav-item" lay-unselect>
                    <a href="javascript:;">
                        <img src="img/default_avatar.jpg" class="layui-nav-img"><span style="color:#000000">我/需求对话1</span>
                    </a>
                    <dl class="layui-nav-child">
                        <!-- <dd style="text-align: center;"><a href="javascript:;"><i class="layui-icon layui-icon-component"></i>应用1</a></dd>
                        <dd style="text-align: center;"><a href="javascript:;"><i class="layui-icon layui-icon-component"></i>应用2</a></dd>
                        <hr> -->
                        <dd style="text-align: center;"> <a href="javascript:;"  lay-on="tabAdd"><i class="layui-icon layui-icon-addition"></i>创建应用</a></dd>
                    </dl>
                </li>
            </ul>
        </ul>

    </div>

    <!-- <div v-if="showBox" class="setBox layui-anim layui-anim-up" style="display:none">

        <table class="layui-table " lay-skin="nob" lay-even	>
            <tr>
                <td>
                    API地址设置：<br>
                    <input type="text" v-model="apiUrl"  class="layui-input">

                    <br>
                    <a class="layui-btn layui-btn-sm" @click="apiUrl='https://yewu.bcwhkj.cn/api/v2.Gptliu/search';alert('已将API地址设为冰橙GPT专用的国内API接口地址,无需科学上网，国内直连，简单快捷，支持流式/非流式')">冰橙GPTAPI地址</a>
                    <a class="layui-btn layui-btn-sm"  @click="apiUrl='https://api.openai.com/v1/chat/completions';alert('已将API地址设为官方接口地址，请确保你本地环境能正常发起请求')">openai官方API地址</a>
                </td>
            </tr>
            <tr>
                <td>
                    token / key设置：<br>
                    <input type="password" v-model="apiKey"  class="layui-input">
                    <br>
                    <a class="layui-btn layui-btn-sm" @click="openGzHbc()">
                </td>
            </tr>
            <tr>
                <td>
                    Model名称：<br>
                    <input type="text" v-model="apiModel"  class="layui-input">
                    <br>
                    <a class="layui-btn layui-btn-sm"  @click="apiModel='gpt-3.5-turbo-1106';">gpt-3.5-turbo-1106</a>
                    <a class="layui-btn layui-btn-sm"  @click="apiModel='gpt-3.5-turbo';">gpt-3.5-turbo</a>
                </td>
            </tr>
            <tr>
                <td class="cen" style="padding-top: 80px;">
                    <a @click="save()" class="layui-btn layui-btn-danger">保存并返回</a>
                </td>
            </tr>
        </table>
    </div> -->

    <!--显示内容-->
    <!-- <div class="layui-tab" lay-filter="test-handle" lay-allowclose="true">
        <ul class="layui-tab-title">
        </ul>
        <div class="layui-tab-content">
        </div>
    </div> -->

    <!-- 初始内容 -->
    <!--            <div id="init-content" class="layui-row" style="font-size:30px;margin-top:-50px;margin-left: 30px;">-->
    <!--              <div class="layui-col-xs3">-->
    <!--                <div class="layui-btn-container" style="background-color:#f7f7f7; display: flex;height:300px;width:300px;justify-content:center;align-items: center;margin: 10px 10px" lay-on="tabChange">-->
    <!--                  <a style="display:inline-block;margin: auto 0;" href="javascript:;" ><i class="layui-icon layui-icon-component" style="font-size: 30px;"></i>应用1</a>-->
    <!--                </div>-->
    <!--              </div>-->
    <!--              <div class="layui-col-xs3">-->
    <!--                <div class="layui-btn-container" style="background-color:#f7f7f7; display: flex;height:300px;width:300px;justify-content:center;align-items: center;margin: 10px 10px" lay-on="tabChange">-->
    <!--                  <a style="display:inline-block;margin: auto 0;" href="javascript:;" ><i class="layui-icon layui-icon-component" style="font-size: 30px;"></i>应用2</a>-->
    <!--                </div>-->
    <!--              </div>-->
    <!--              <div class="layui-col-xs3">-->
    <!--                <div class="layui-btn-container" style="background-color:#f7f7f7; display: flex;height:300px;width:300px;justify-content:center;align-items: center;margin: 10px 10px" lay-on="tabChange">-->
    <!--                  <a style="display:inline-block;margin: auto 0;" href="javascript:;" ><i class="layui-icon layui-icon-component" style="font-size: 30px;"></i>应用3</a>-->
    <!--                </div>-->
    <!--              </div>-->
    <!--              <div class="layui-col-xs3">-->
    <!--                <div class="layui-btn-container" style="background-color:#f7f7f7; display: flex;height:300px;width:300px;justify-content:center;align-items: center;margin: 10px 10px" lay-on="tabChange">-->
    <!--                  <a style="display:inline-block;margin: auto 0;" href="javascript:;" ><i class="layui-icon layui-icon-component" style="font-size: 30px;"></i>应用3</a>-->
    <!--                </div>-->
    <!--              </div>-->
    <!--              <div class="layui-col-xs3">-->
    <!--                <div class="layui-btn-container" style="background-color:#f7f7f7; display: flex;height:300px;width:300px;justify-content:center;align-items: center;margin: 10px 10px" lay-on="prompt">-->
    <!--                  <a  style="display:inline-block;margin: auto 0;" href="javascript:;" ><i class="layui-icon layui-icon-addition"  style="font-size: 30px;"></i>创建应用</a>-->
    <!--                </div>-->
    <!--              </div>-->
    <!--            </div>-->


    <!--内容-->
    <div id="content-chat" class="layui-row" >


      <!--竖向导航-->

      <div class="layui-col-xs2">

          <div style="padding: 0 20px;" class="shu-nav">


                    <div class="layui-row">
                      <ul class="layui-nav layui-nav-tree layui-bg-gray">
                        <li class="layui-nav-item"><a href="javascript:;"><i class="layui-icon layui-icon-add-1"></i>新对话</a></li>
                        </ul>
                    </div>

                    <div class="layui-row">
                      <ul class="layui-nav layui-nav-tree layui-bg-gray">
                        <li class="layui-nav-item"><a href="javascript:;" style="color: var(--Grays-Gray-2, var(--Grays-Gray-2, #AEAEB2));">今天</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话1</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话2</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话3</a></li>
                        </ul>
                    </div>


                    <div class="layui-row">
                      <ul class="layui-nav layui-nav-tree layui-bg-gray">
                        <li class="layui-nav-item"><a href="javascript:;"style="color: var(--Grays-Gray-2, var(--Grays-Gray-2, #AEAEB2));">昨天</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话1</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话2</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话3</a></li>
                        </ul>
                    </div>


                    <div class="layui-row">
                      <ul class="layui-nav layui-nav-tree layui-bg-gray">
                        <li class="layui-nav-item"><a href="javascript:;"style="color: var(--Grays-Gray-2, var(--Grays-Gray-2, #AEAEB2));">6月30日</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话1</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话2</a></li>
                        <li class="layui-nav-item"><a href="javascript:;">需求对话3</a></li>
                        </ul>
                    </div>

              </div>


      </div>

        <!--显示内容·-->
        <div class="layui-col-xs10">


            <!--提示1-->
            <!-- <div style="line-height: 70px;font-weight: bold;font-size:18px;">
                编排
            </div> -->

            <!--提示词prompt-->
            <!-- <div class="layui-col-xs6" style="padding-right:20px;">

                <div style="border:2px solid #0077ff;border-radius:10px;background:#ddddff">
                    <div style="line-height: 40px;font-weight: bold;margin-left:15px">
                        提示词
                    </div>
                    <div class="layui-form">

                        <textarea style="padding: 10px 15px;height:300px;border-radius:10px;outline:none!important;" name="" placeholder="多行文本框" class="layui-textarea"></textarea>
                    </div>
                </div>

            </div> -->

            <!--输入与预览-->
            <div class="layui-col-xs12" style="padding:0 20px;border-radius:10px">


                <!--提示词-->
                <div class="inputAndreview" style="height: 650px;overflow:scroll;overflow-x:hidden;overflow:auto;">
                    <table class="layui-table" >
                        <div class=" layui-anim-up layui-anim" style="position: sticky;top: 10px; background-color: white;border-width:0px;margin:10px 0px;border-radius:10px;">
                            <div class="layui-collapse" lay-accordion style="z-index:999;background-color: white;border-radius:10px;box-shadow: 0px 5px 5px #dddddd">
                                <div class="layui-colla-item" style="border-radius:10px;">
                                    <div class="layui-colla-title" style="background-color: white;border-bottom:0">用户变量</div>
                                    <div class="layui-colla-content layui-show">
                                       填入变量的值，每次启动新会话时该变量将自动替换提示词中的变量。
                                    </div>
                                </div>

                            </div>

                        </div>

                        <tr v-for="item, key in duiLie"  class=" layui-anim-up layui-anim">
                            <div style="color: var(--Grays-Gray-2, var(--Grays-Gray-2, #AEAEB2));text-align: center;font-family: Inter;font-size: 14px;font-style: normal;font-weight: 400;line-height: normal;">{{curTime}}</div>

                            <td style="border-width:0px;">


                              <!--用户-->

                                <div class="layui-row"  @click="Info.wen=item.cxtitlecn1 ? item.cxtitlecn1 : item.wen" v-if="item.wen">

                                    <!-- <div style="font-size:15px;color:black;  word-break:break-all; white-space:pre-wrap;float: right; max-width:100%;"> -->

                                        <div class="layui-row" style="display: flex;justify-content: flex-end;gap: 28px;align-self: stretch;flex-direction:row-reverse;">
                                          <div class="layui-col-xs1" >
                                            <div style="display: inline-block;vertical-align:top;height:30px;width:30px;">
                                              <img style="height:100%;width:100%;border-radius:50%;" src="img/default_avatar.jpg"></img>
                                            </div>
                                          </div>
                                            <div class="layui-col-xs11">
                                              <div style="display: inline-block;vertical-align:top;background-color:#95A4FC;border-radius:16px 0px 16px 16px;padding:10px 10px;float:right;">
                                                <div v-html="item.cxtitlecn1 ? item.cxtitlecn1 : item.wen"></div>
                                              </div>
                                            </div>

                                        </div>
                                </div>

                                <!-- <span style="color: #fff; float: right; background: #2870EA; padding:5px; font-size: 15px;line-height: 26px; max-width:80%; " @click="Info.wen=item.cxtitlecn1 ? item.cxtitlecn1 : item.wen" v-if="item.wen">
                                    {{item.cxtitlecn1 ? item.cxtitlecn1 : item.wen}}
                                </span> -->
                                <!-- <div class="layui-row" style="margin: 10px 0px"> -->

                                <!--GPT-->

                                    <div @click="Info.wen=item.wen" @click="copy(item.da)" v-if="item.da" class="layui-row"  class="layui-row" style="display: flex;align-self: stretch;margin: 10px 0px">
                                        <!-- <div v-if="item.da" style="font-size:15px;color:black;  word-break:break-all; white-space:pre-wrap;float: left; max-width:100%;"> -->
                                       <!-- <div v-if="item.da" class="layui-row" style="display: flex;height: 56px;align-items: center;gap: 28px;align-self: stretch;"> -->
                                                <div class="layui-col-xs1" >
                                                  <div style="display: inline-block;vertical-align:top;justify-content: flex-start;height:30px;width:30px;">
                                                     <img style="height:100%;width:100%;border-radius:50%;" src="img/default_avatar.jpg"></img>
                                                  </div>
                                                </div>
                                                <div class="layui-col-xs11">
                                                  <div style="display: inline-block;vertical-align:top;background-color:#F7F9FB;border-radius: 0px 16px 16px 16px;padding:10px 10px;float:left;">
                                                      <div v-html="item.da"></div>
                                                  </div>
                                                </div>
                                            <!-- <div class="layui-row">
                                              <div class="layui-col-xs10" style="vertical-align:top;display:inline-block;background-color:#aaaaff;padding:20px 20px;border-radius:10px;margin-left:10px;">  {{item.cxtitlecn1 ? item.cxtitlecn1 : item.wen}}</div>
                                              <div class="layui-col-xs2" style="vertical-align:top;display:inline-block;height:30px;weight:30px;"><img style="height:100%;weight:100%;border-radius:50%;" src="./default_avatar.jpg"></img></div>
                                            </div> -->
                                        <!-- </div> -->
                                    </div>
                                <!-- </div> -->
                                <!-- <div class="layui-clear"></div> -->


                            </td>
                        </tr>
                    </table>
                </div>



                <!--答复栏-->
                <!-- <div style="height:250px;">
                </div> -->


                <!--输入的问题-->
                <div class="layui-table" style="z-index:999;position: fixed;bottom: 0px;  right: 0px;    width: 82%;margin:0px;padding: 10px 10px;border: 1px solid #0C61FD;border-radius: 10px;background: linear-gradient(90deg, rgba(128, 84, 255, 0.05) 0%, rgba(1, 131, 251, 0.05) 100%);">
                            <div style="float:left; width: 80%; overflow: hidden;border-radius: 10px;">
                                <input id="quInput"  style="padding-right: 15px;border:0;background: linear-gradient(90deg, rgba(128, 84, 255, 0.05) 10%, rgba(1, 131, 251, 0.05) 100%);" class="layui-input"  type="text" placeholder="输入您的问题" v-model="Info.wen" @keyup.enter="tiJiaoWenTi()">
                            </div>
                            <div style="float:left; width: 20%;  overflow: hidden;">
                                <a @click="tiJiaoWenTi()" style="width: 100%;"  class="layui-btn layui-btn-normal" >提交</a>
                            </div>
                            <div class="layui-clear"></div>
                </div>

            </div>


        </div>
    </div>


</div>

<script>

    layui.use(function(){
        var element = layui.element;
        var util = layui.util;
        // 普通事件
        util.on('lay-on', {
            tabAdd: function(){
                // 新增一个 tab 项
                console.log( document.getElementById('content-chat').innerHTML);


                var label = (Math.random()*1000|0); // 标记 - 用于演示
                element.tabAdd('test-handle', {
                    title: '新选项'+ label,
                    content: document.getElementById('content-chat').innerHTML,
                    id: new Date().getTime(), // 实际使用一般是规定好的id，这里以毫秒数模拟
                    change: true // 是否添加完毕后即自动切换
                })

            },
            tabDelete: function(othis){
                // 删除指定 tab 项
                element.tabDelete('test-handle', '44'); // 删除：“商品管理”
                othis.addClass('layui-btn-disabled');
            },
            tabChange: function(){
                // 切换到指定 tab 项
                element.tabChange('test-handle', '33'); // 切换到：标签3
            }
        });
    });


    layui.use(function(){
        var layer = layui.layer;
        var util = layui.util;
        // 批量事件
        util.on('lay-on', {

            prompt: function(){
                layer.prompt({title: '应用名称', formType: 0}, function(text, index){
                    layer.close(index);
                    console.log('您输入的；文本：'+ text);
                    var element = layui.element;
                    var util = layui.util;


                    var label = (Math.random()*1000|0); // 标记 - 用于演示

                    document.getElementById('init-content').style.display="none";
                    element.tabAdd('test-handle', {
                        title: text,
                        content:  document.getElementById('content-chat').innerHTML,
                        id: new Date().getTime(), // 实际使用一般是规定好的id，这里以毫秒数模拟
                        change: true // 是否添加完毕后即自动切换
                    })

                });
            }
        });
    });


    var that,timer;
    var app = new Vue({
        el: '#app',
        data:{
            apiKey:'',
            apiUrl:'answerStream',
            apiModel:'gpt-3.5-turbo-1106', //新模型速度贼快
            bcApiUrl:'answerStream',
            curTime: "2024",
            Info:{
                wen:'',
                cxtitlecn1:'',
            },
            List:[],
            pageCount:''
            ,count:''
            ,search:{
                page:1,
                limit:10,
            },
            showBox:false,
            hsTime:0,
            tiWenZhong:false,
            duiLie:[
                {
                    wen:'',
                    cxtitlecn1:'',
                    da:'你好,我是REQGUARD，请输入你的需求~',
                    cxCount:'',
                    time:0,
                    cxaddtime:'',
                    hsTime:0,
                }
            ],
            curDuiLie:0,
            lianXu:false,
            history:1,

        },
        created() {

          this.curTime = this.getCurrentTime();

        },
        mounted () {
            that = this;
            if(that.getQV('key')){
                that.apiKey=that.getQV('key');
                localStorage.token=that.apiKey;
            }
            if(localStorage.token){
                that.apiKey=localStorage.token;
            }

        },
        methods: {
            getCurrentTime() {
                //获取当前时间并打印
                var _this = this;
            　　let yy = new Date().getFullYear();
            　　let mm = new Date().getMonth()+1;
            　　let dd = new Date().getDate();
            　　let hh = new Date().getHours();
            　　let mf = new Date().getMinutes()<10 ? '0'+new Date().getMinutes() : new Date().getMinutes();
            　　let ss = new Date().getSeconds()<10 ? '0'+new Date().getSeconds() : new Date().getSeconds();
            　　_this.gettime = yy+'/'+mm+'/'+dd+' '+hh+':'+mf+':'+ss;
            　　console.log(_this.gettime)
               return _this.gettime;
          },
            save(){
                console.log('保存')
                localStorage.token=that.apiKey;
                that.showBox=!that.showBox;
            },

            tiJiaoWenTi(){
                // if(that.tiWenZhong==true){
                //     layer.msg('当前有问题进行中……，请稍候再提交');
                //     return false;
                // }


                // document.getElementById("quInput").value = "";
                //
                // console.log(document.getElementById("quInput").value);

                console.log('触发提交问题！');


                if(that.Info.wen){
                    //移到页面最下面
                    $("html,body").animate({scrollTop:"9999999px"},1800);

                    that.tiWenZhong=true;
                    that.duiLie.push({
                        wen:that.Info.wen,
                        cxtitlecn1:that.Info.cxtitlecn1,
                        da:'',
                        cxCount:'loading……',
                        hsTime:0,
                    })


                    that.Info.wen = "";

                    let postD={
                        keyword:that.Info.wen
                        ,cxtitlecn1:that.Info.cxtitlecn1 ? that.Info.cxtitlecn1 : that.Info.wen
                        ,token:localStorage.token
                        ,history:that.history
                    }
                    let  lastNo=that.duiLie.length-1;


                    //启用连续对话
                    if(that.lianXu && that.duiLie.length>1){
                        postD.keyword='';
                        // postD.keyword= postD.keyword + 'Q: 请你后续所有回复请优先用中文做答 A: 好的。 <|endoftext|>';
                        // postD.keyword= postD.keyword + ' Q: '+that.duiLie[0].wen + ' A: '+that.duiLie[0].da+'。 <|endoftext|>';
                        // that.duiLie.forEach((v,k)=>{
                        //     //限制只提交最近的5个回合内的对话内容提交，以防太长无法提交
                        //     if(k<lastNo && ((lastNo-k)<=5) && v.wen && k>0){
                        //         postD.keyword= postD.keyword + ' Q: '+v.wen + ' A: '+v.da+'。 <|endoftext|>';
                        //     }
                        // })
                        postD.keyword=postD.keyword+' Q: '+that.Info.wen + ' A: ';
                    }

                    //开始计时
                    timers = setInterval(() => {that.hsTime++;},1000);

                    //替换掉连续对话时的一些换行符
                    // postD.keyword=postD.keyword.replace(/\//g,'');


                    // postD.keyword = postD.keyword + '<|endoftext|>做为一个专业的软件工程师，请你用尽可能详尽的注释和代码来解释我提出的问题，如果前面提交的问题或是接下来的回复内容如果与软件编程技术无关的话，请回复“此问题不在可回复范围内”';
                    that.liuTiJiao(lastNo,postD.keyword,0);
                }

            },

            getQV(variable)//获取get参数
            {

                //获取get参数
                var getV;
                var query = window.location.search.substring(1);
                var vars = query.split("&");
                for (var i=0;i<vars.length;i++) {
                    var pair = vars[i].split("=");
                    if(pair[0] == variable){
                        getV=decodeURI(pair[1]);
                        return decodeURI(pair[1]);
                    }
                }
                return(false);
            },


            //sse  fetch   Post
            liuTiJiao(lastNo,keys,cid){


                let openaiId='';
                var postData = JSON.stringify({
                    model: that.apiModel,
                    messages: [{role: 'user', content: keys}],
                    stream:true
                });
                var headerss={
                    'Content-Type': 'application/json',
                    'Authorization':'Bearer '+that.apiKey
                };

                console.log('提交的数据：',postData)


                // let isEnd = false;
                //
                //
                // while(!isEnd){

                var answer = "";
                fetch(that.apiUrl,{
                    method:'post',
                    headers:headerss,
                    body:postData
                }).then(function(response) {

                    //console.log('返回的全部数据：',response);
                    let end=setInterval(function(){},1000); for(let i=1; i<=end;i++){clearInterval(i);}
                    $("html,body").animate({scrollTop:"9999999px"},1800);
                    that.hsTime=0;

                    let reader = response.body.getReader()

                    let pump = () => {
                        return reader.read().then(({ value, done }) => {
                            if (done) {
                                console.log('完成')

                                that.Info.wen='';
                                that.Info.cxtitlecn1='';
                                that.tiWenZhong=false;
                                return false;
                            }
                            let s=that.Utf8ArrayToStr(value);

                            // var urlRe = /<a[^>]*href=['"]([^"]*)['"][^>]*>(.*?)<\/a>/g;
                            //
                            // var urlStr = urlRe.exec(s)
                            // console.log("url: "+urlStr)


                            that.duiLie[lastNo].da+=marked(s);

                            // if (!urlStr){
                            //     that.duiLie[lastNo].da+=s;
                            // }else {
                            //
                            //
                            //     console.log("url: " + urlStr[1]) // 123
                            //
                            //     that.duiLie[lastNo].da+="<div style=\"margin-top: 10px\"></div>";
                            //     that.duiLie[lastNo].da+="<a href=''\""+urlStr[1]+"\">"+urlStr[1]+"</a>";
                            // }



                            console.log("接收到: "+s);
                            // try{
                            //     let returnD=JSON.parse(s);
                            //     answer = returnD.answer;
                            //
                            //     if(returnD.codes==200 ){
                            //
                            //         isEnd = true;
                            //
                            //     }
                            // }catch(e){
                            //     console.log('返回内容无JSON格式，可能是流式内容，继续执行')
                            // }
                            //let s=value;


                            return pump()
                        })
                    }
                    pump()
                }).catch(function(err){
                    console.log("Fetch错误:",err);
                    that.duiLie[lastNo].da = "您的网络断了......";
                })

                // that.duiLie[lastNo].da += answer;
                // }



            },

            Utf8ArrayToStr:function(array) {
                var out, i, len, c;
                var char2, char3;

                out = "";
                len = array.length;
                i = 0;
                while(i < len) {
                    c = array[i++];
                    switch(c >> 4)
                    {
                        case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
                        // 0xxxxxxx
                        out += String.fromCharCode(c);
                        break;
                        case 12: case 13:
                        // 110x xxxx   10xx xxxx
                        char2 = array[i++];
                        out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
                        break;
                        case 14:
                            // 1110 xxxx  10xx xxxx  10xx xxxx
                            char2 = array[i++];
                            char3 = array[i++];
                            out += String.fromCharCode(((c & 0x0F) << 12) |
                                ((char2 & 0x3F) << 6) |
                                ((char3 & 0x3F) << 0));
                            break;
                    }
                }

                return out;
            },

            //替换掉所有换行符
            removeNewlines(str) {
                return str.replace(/(\r\n|\n|\r)/gm, "");
            },
            // 文字逐个出现（本地伪逐字输出）
            printCharByChar(str,lastNo) {
                for (let i = 0; i < str.length; i++) {
                    setTimeout(() => {
                        //console.log(str[i]);
                        that.duiLie[lastNo].da+= str[i];
                    }, i * 40);
                }
            },

            openGzH(){
                var index = layer.open({
                    content: '<img src="https://mp-908027cd-0849-4303-ae20-d3bed9830e3a.cdn.bspapp.com/cloudstorage/1dc5e9e2-2da7-4df0-8b6e-bde75b2b131f.jpg" style="height: 300px;" ><br>长按识别二维码，关注公众号进行留言咨询'
                });
            },

            openGzHbc(){
                var index = layer.open({
                    content: '<img src="https://mp-908027cd-0849-4303-ae20-d3bed9830e3a.cdn.bspapp.com/cloudstorage/6b749532-fb8a-4067-85a8-10d86f61c888.png" style="height: 300px;" ><div class="cen">长按识别二维码，进入冰橙GPT<br>右上角充值菜单/个人中心获取token<Br>开发者可加QQ群：<a href="https://qm.qq.com/cgi-bin/qm/qr?k=myxd2_kh_dLfiw5exh8RjoBPVwavfDBI&jump_from=webapi&authKey=oxED9HlmXW/VqRERbNo1szTF+wH3DkUMBlUKjqh6k8EgjPFOIVTNxDF1fhxmiyn+" style="color:#f00"  target="_blank">310872519</a><br>入群@管理员可申请10万字符用于API调试</div>'
                });
            },

            openQQQun(){
                var index = layer.open({
                    content: '<div class="cen">开发者可加QQ群：<a href="https://qm.qq.com/cgi-bin/qm/qr?k=myxd2_kh_dLfiw5exh8RjoBPVwavfDBI&jump_from=webapi&authKey=oxED9HlmXW/VqRERbNo1szTF+wH3DkUMBlUKjqh6k8EgjPFOIVTNxDF1fhxmiyn+" target="_blank" style="color:#f00">310872519</a> 【点击加入】 <br>入群@管理员可申请10万字符用于API调试</div>'
                });
            },

            clearList(){
                that.duiLie.splice(0,that.duiLie.length);
            },
            /**
             * @return post请求方法
             */
            PostUrl(urls, postData,callback,title='') {
                // if(postData.token){
                //     postData.token=kimi(postData.token);
                // }
                let start = new Date().getTime()

                axios.post(urls, postData)
                    .then(function (res) {
                        let data = res.data;
                        let end = new Date().getTime();
                        let useTime =end - start;
                        console.log('%cPostReturn - '+ title,'background-color:green;padding:3px;color:#fff',data,'PostUrl:'+urls,'PostData',postData,'计时:',useTime,' ms');
                        callback(data);

                    })
                    .catch(function (error) {
                        let end = new Date().getTime();
                        let useTime =end - start;
                        console.log('%cError PostReturn - '+ title,'background-color:green;padding:3px;color:#fff',error,'PostUrl:'+urls,'PostData',postData,'计时:',useTime,' ms');
                        callback(error);
                    });
            },
            /**
             * @return 当前时间
             */
            Now(){
                return moment().get('year')+'-'+
                    (moment().get('month')+1)+'-'+
                    moment().get('date')+' '+
                    moment().get('hour')+':'+
                    moment().get('minute')+':'+
                    moment().get('second');
            },




        }
    });


</script>
</body>
</html>
